<template>
    <view>
		<block v-if="data_list.length > 0">
		   <!-- 列表 -->
		   <scroll-view :scroll-y="true" class="scroll-box" @scrolltolower="scroll_lower" lower-threshold="30">
		       <view v-if="data_list.length > 0" class="padding-horizontal-main padding-top-main">
		           <view v-for="(item, index) in data_list" :key="index" class="list-item padding-horizontal-main padding-top-main padding-bottom-main border-radius-main bg-white oh spacing-mb">
		   			<view class="box1 fl oh tc">
		   				<image class="img1" :src="item.avatar" mode="widthFix"></image>
						<view class="p1 single-text">{{$t('fengcheche.qiandao.userid')}}：{{item.id}}</view>
		   				<view v-if="(item.nickname || null) != null" class="p1 single-text">{{item.nickname}}</view>
		   				<view v-else class="p1 single-text">{{item.username}}</view>
		   				<view v-if="(item.mobile_security || null) != null" class="p2 single-text">{{item.mobile_security}}</view>
		   			</view>
		   			<view class="box3 fr oh tc pr">
		   				<view class="p1 single-text" @tap="choseuser" :data-value="item.id">{{$t('fengcheche.qiandao.choseher')}}</view>
		   			</view>
		           </view>
		       </view>
		       <view v-else>
		           <!-- 提示信息 -->
		           <component-no-data :propStatus="data_list_loding_status"></component-no-data>
		       </view>
		   
		       <!-- 结尾 -->
		       <component-bottom-line :propStatus="data_bottom_line_status"></component-bottom-line>
		   </scroll-view>
		   <view class="bottom-fixed padding-main">
		       <button class="bg-main br-main cr-white round text-size" type="default" @tap="clear_result" hover-class="none">{{$t('fengcheche.qiandao.clearres')}}</button>
		   </view>
		</block>
		<block v-else>
			<view class="chaxunorderbox">
				<view class="chaxunorder">
					<input type="text" :placeholder="$t('fengcheche.qiandao.tiaojian')" class="form-item margin-vertical-main wh-auto yxformplus-item" @blur="yxblur" @confirm="yxblur">
				</view>
				<view class="form-gorup form-gorup-submit">
					<button class="bg-main br-main cr-white round text-size" type="default" @click="search_event" hover-class="none">{{$t('fengcheche.qiandao.chaxun')}}</button>
				</view>
			</view>
		</block>
		
		<!-- 购买弹层 -->
		<component-popup :propShow="popup_status" propPosition="bottom" @onclose="popup_close_event">
		    <view class="goods-popup padding-main bg-white">
		        <view class="close fr oh">
		            <view class="fr" @tap.stop="popup_close_event">
		                <icon type="clear" size="20"></icon>
		            </view>
		        </view>
		        <view class="goods-popup-content">
		            <view class="goods-spec-choose">
		            	<view class="item br-b">
		            		<view class="title">{{$t('fengcheche.qiandao.nowyour')}}：<text v-if="(userinfo || null) != null">{{userinfo.integral}}</text></view>
		            		<view class="spec">
								<input type="number" :placeholder="$t('fengcheche.qiandao.tianxie')" class="form-item margin-vertical-main wh-auto yxformplus-item" @blur="yxblur_num" @confirm="yxblur_num">
		            		</view>
						</view>
					</view>
		        </view>
		        <button class="goods-popup-submit bg-main cr-white" type="default" @tap.stop="goods_buy_confirm_event" hover-class="none">{{$t('index.index.7w75zb')}}</button>
		    </view>
		</component-popup>
    </view>
</template>
<script>
	import componentPopup from '@/components/popup/popup';
    import componentNoData from "@/components/no-data/no-data";
    import componentBottomLine from "@/components/bottom-line/bottom-line";
	
	const app = getApp();
    var common_static_url = app.globalData.get_static_url('common');
    export default {
        data() {
            return {
                common_static_url: common_static_url,
                data_list_loding_status: 1,
                data_list_loding_msg: '',
                data_bottom_line_status: false,
                detail_list: [],
				form_submit_loading: false,
				data_list:[],
				data_page:1,
				data_page_total: 0,
				data_total: 0,
				input_keyword_value:'',
				user_id:0,
				popup_status: false,
				userinfo:null,
				num:0,
				subflag: false,
            };
        },

        components: {
			componentPopup,
            componentNoData,
            componentBottomLine
        },
        props: {},

        onLoad(params) {

        },

        onShow() {
			app.globalData.page_event_onshow_handle();
            // 数据加载
            this.init();
        },

        // 下拉刷新
        onPullDownRefresh() {
            this.init();
        },

        methods: {
            init() {
                var user = app.globalData.get_user_info(this, 'init');
            
                if (user != false) {
					// 获取数据
					if(this.input_keyword_value != ''){
						this.setData({
							data_page: 1,
							input_keyword_value:'',
							data_list:[],
							user_id:0
						});
						this.get_data_list(1);
					}
					// 调取自己的积分值
					this.get_base_data();
                } else {
                    this.setData({
                        data_list_loding_status: 0,
                        data_bottom_line_status: false
                    });
                }
            },
			
			// 清空搜索结果
			clear_result(){
				this.setData({
				    data_page: 1,
					input_keyword_value:'',
					data_list:[],
				});
				this.init();
			},
			
			// 随时记录输入的关键字
			yxblur(e){
				var value = e.detail.value;
				this.setData({
					input_keyword_value:value
				});
			},
			
			// 随时记录输入的数值
			yxblur_num(e){
				var value = e.detail.value;
				this.setData({
					num:value
				});
			},
			
			// 点击搜索会员
			search_event(){
				if((this.input_keyword_value || null) == null || this.input_keyword_value == ''){
					app.globalData.showToast(this.$t('search.search.ic9b89'));
					return false;
				}
				this.setData({
				    data_page: 1,
					data_list:[],
					user_id:0,
				});
				this.get_data_list(1);
			},
			
			// 获取数据
			get_data_list(is_mandatory) {
			    // 分页是否还有数据
			    if ((is_mandatory || 0) == 0) {
			        if (this.data_bottom_line_status == true) {
			            return false;
			        }
			    } 
				
				// 加载loding
			    uni.showLoading({
			        title: this.$t('common.loading_in_text'),
			    });
			    this.setData({
			        data_list_loding_status: 1
			    }); 
				
				// 获取数据
			    uni.request({
			        url: app.globalData.get_request_url('souuser', 'index', 'qiandao'),
			        method: 'POST',
			        data: {
			            page: this.data_page,
			            keywords: this.input_keyword_value || ''
			        },
			        dataType: 'json',
			        success: (res) => {
			            uni.hideLoading();
			            uni.stopPullDownRefresh();console.log(res);
			
			            if (res.data.code == 0) {
			                if (res.data.data.data.length > 0) {
			                    if (this.data_page <= 1) {
			                        var temp_data_list = res.data.data.data; 
			                    } else {
			                        var temp_data_list = this.data_list;
			                        var temp_data = res.data.data.data;
			
			                        for (var i in temp_data) {
			                            temp_data_list.push(temp_data[i]);
			                        }
			                    }
			
			                    this.setData({
			                        data_list: temp_data_list,
			                        data_total: res.data.data.total,
			                        data_page_total: res.data.data.page_total,
			                        data_list_loding_status: 3,
			                        data_page: this.data_page + 1,
			                    }); 
								
								// 是否还有数据
			                    if (this.data_page > 1 && this.data_page > this.data_page_total) {
			                        this.setData({
			                            data_bottom_line_status: true
			                        });
			                    } else {
			                        this.setData({
			                            data_bottom_line_status: false
			                        });
			                    }
			                } else {
			                    this.setData({
			                        data_list_loding_status: 0,
			                        data_list: [],
			                        data_bottom_line_status: false
			                    });
								app.globalData.showToast(this.$t('fengcheche.qiandao.noresult'));
			                }
			            } else {
			                this.setData({
			                    data_list_loding_status: 0,
			                });
			
			                if (app.globalData.is_login_check(res.data, this, 'get_data_list')) {
			                    app.globalData.showToast(res.data.msg);
			                }
			            }
			        },
			        fail: () => {
			            uni.hideLoading();
			            uni.stopPullDownRefresh();
			            this.setData({
			                data_list_loding_status: 2,
			            });
			            app.globalData.showToast(this.$t('common.internet_error_tips'));
			        }
			    });
			},
			
			// 单独调用
			get_base_data() {
				var self = this;
			    uni.request({
			        url: app.globalData.get_request_url('baseinfo', 'index', 'qiandao'),
			        method: 'POST',
			        data: {},
			        dataType: 'json',
			        success: (res) => {
			            if (res.data.code == 0) {
			                self.setData({
			                    userinfo: res.data.data || null,
			                }); 
			            } else {
			                app.globalData.showToast(res.data.msg);
			            }
			        },
			        fail: () => {
			            uni.stopPullDownRefresh();
			            app.globalData.showToast(this.$t('common.internet_error_tips'));
			        }
			    });
			},
			
			// 滚动加载
			scroll_lower(e) {
			    this.get_data_list();
			},
			
			// 选择当前会员
			choseuser(e){
				var value = e.currentTarget.dataset.value;
				this.setData({
					user_id:value,
					popup_status: true
				});
			},
			
			// 购买弹层关闭
			popup_close_event(e) {
			    this.setData({
			        popup_status: false,
					user_id:0
			    });
			},
			
			// 提交赠送
			goods_buy_confirm_event(e) {
				var self = this;
			    // 数据验证
			    if(this.num == 0 || this.num == ''){
					app.globalData.showToast(this.$t('fengcheche.qiandao.numcannot'));
					return false;
				}
				if(this.user_id == 0 || this.user_id == ''){
					app.globalData.showToast(this.$t('fengcheche.qiandao.usercannot'));
					return false;
				}
			    if (!this.subflag) {
			        uni.showLoading({
			            title: this.$t('buy.buy.r79t77')
			        });
			        this.setData({
			            form_submit_loading: true
			        });
			        this.subflag = true;
			        // 网络请求
			        uni.request({
			            url: app.globalData.get_request_url('sendscore', 'index', 'qiandao'),
			            method: 'POST',
			            data: {
							num: this.num || 0,
							user_id_new: this.user_id || 0
						},
			            dataType: 'json',
			            success: res => {
			                uni.hideLoading();
							this.subflag = false;
			                if (res.data.code == 0) {
			                    app.globalData.showToast(res.data.msg, "success");
			                    setTimeout(function() {
			                        app.globalData.url_open('/pages/fcc/qiandao/score/score', true);
			                    }, 1000);
			                } else {
			                    this.setData({
			                        form_submit_loading: false
			                    });
			                    if (app.globalData.is_login_check(res.data)) {
			                        app.globalData.showToast(res.data.msg);
			                    } else {
			                        app.globalData.showToast(this.$t('common.sub_error_retry_tips'));
			                    }
			                }
			            },
			            fail: () => {
							this.subflag = false;
			                uni.hideLoading();
			                this.setData({
			                    form_submit_loading: false
			                });
			                app.globalData.showToast(this.$t('common.internet_error_tips'));
			            }
			        });
			    }
			}
        }
    };
</script>
<style>
    @import './score-user-search.css';
</style>